﻿
<template>
<div class="card-fill layout-padding" v-loading="loading" element-loading-text="Loading...">

<el-card shadow="hover" class="layout-padding-auto create-form" >
  <el-form ref="formRef" :model="stateData.vmModel" label-width="120px">
    
<div class="form-section">
  <div class="section-title">
    <i class="_wtmicon _wtmicon-wxbzhanghu"></i>
    <span>用户信息</span>
  </div>

  <el-row :gutter="20">

    <el-col :xs="24" :lg="12" class="mb20">
        <el-form-item ref="Entity_UserId_FormItem" prop="Entity.UserId"  >
            <template #label>
                <WtmLabelTooltip label="绑定用户" tooltip="关联的系统用户对象" />
            </template>
            <el-select v-model="stateData.vmModel.Entity.UserId" clearable class="width100">
                       <el-option v-for="item in stateData.AllFrameworkUsers" :key="item.Value" :value="item.Value" :label="item.Text"></el-option></el-select>
        </el-form-item>
    </el-col>
  </el-row>

</div>

<div class="form-section">
  <div class="section-title">
    <i class="_wtmicon _wtmicon-wxbzhanghu"></i>
    <span>菜单信息</span>
  </div>

  <el-row :gutter="20">

    <el-col :xs="24" :lg="12" class="mb20">
        <el-form-item ref="Entity_MenuId_FormItem" prop="Entity.MenuId"   :rules="[{ required: true, message:'菜单ID为必填项',trigger:'blur'}]">
            <template #label>
                <WtmLabelTooltip label="菜单ID" tooltip="收藏菜单的唯一标识符" />
            </template>
            <el-input v-model="stateData.vmModel.Entity.MenuId" clearable class="width100"></el-input>
        </el-form-item>
    </el-col>
    <el-col :xs="24" :lg="12" class="mb20">
        <el-form-item ref="Entity_MenuName_FormItem" prop="Entity.MenuName"   :rules="[{ required: true, message:'菜单名称为必填项',trigger:'blur'}]">
            <template #label>
                <WtmLabelTooltip label="菜单名称" tooltip="收藏菜单的显示名称" />
            </template>
            <el-input v-model="stateData.vmModel.Entity.MenuName" clearable class="width100"></el-input>
        </el-form-item>
    </el-col>
    <el-col :xs="24" :lg="12" class="mb20">
        <el-form-item ref="Entity_MenuIcon_FormItem" prop="Entity.MenuIcon"  >
            <template #label>
                <WtmLabelTooltip label="菜单图标" tooltip="收藏菜单显示的图标样式" />
            </template>
            <el-input v-model="stateData.vmModel.Entity.MenuIcon" clearable class="width100"></el-input>
        </el-form-item>
    </el-col>
    <el-col :xs="24" :lg="12" class="mb20">
        <el-form-item ref="Entity_MenuUrl_FormItem" prop="Entity.MenuUrl"  >
            <template #label>
                <WtmLabelTooltip label="菜单URL" tooltip="收藏菜单的访问地址路径" />
            </template>
            <el-input v-model="stateData.vmModel.Entity.MenuUrl" clearable class="width100"></el-input>
        </el-form-item>
    </el-col>
    <el-col :xs="24" :lg="12" class="mb20">
        <el-form-item ref="Entity_SortOrder_FormItem" prop="Entity.SortOrder"  >
            <template #label>
                <WtmLabelTooltip label="排序" tooltip="收藏菜单的显示排序序号，数值越小越靠前" />
            </template>
            <el-input-number v-model="stateData.vmModel.Entity.SortOrder" clearable class="width100"></el-input-number>
        </el-form-item>
    </el-col>
  </el-row>

</div>


    <div style="text-align:right;">
      <WtmButton @click="onSave"  type="primary" :button-text="$t('message._system.common.vm.submit')" style="margin-top:15px;"/>
      
							<WtmButton
								v-if="
									stateData.vmModel.Entity.BillStatus === '草稿' &&
									(stateData.vmModel.Entity.WorkflowStatus === '待提交' || !stateData.vmModel.Entity.WorkflowStatus)
								"
								@click="onSubmit"
								type="primary"
								:button-text="$t('message._system.common.vm.submit')"
								confirm="提交单据以后无法修改，是否确认提交?"
								style="margin-top: 15px"
							/>
                			<template v-if="stateData.vmModel.Entity.BillStatus === '审核中'">
								<WtmButton @click="onAgree" type="primary" button-text="提交" style="margin-top: 15px" />
								<WtmButton @click="onDeny" type="danger" button-text="取消" style="margin-top: 15px" />
							</template>



      <WtmButton @click="onClose"  type="default" :button-text="$t('message._system.common.vm.cancel')" style="margin-top:15px;"/>
    </div>
  </el-form>

</el-card>

</div>
</template>


<script setup lang="ts" name="message._system.common.vm.edit;false">
import ElMessage from 'element-plus/es/components/message/index';
import { reactive, ref, getCurrentInstance, onMounted, computed, nextTick} from 'vue';
import { SysUserFavoriteApi as api } from '/@/views/_admin/sysuserfavorite/api';
import other from '/@/utils/other';
import { useRouter } from "vue-router";
import { ISysUserFavoriteVm } from '/@/views/_admin/sysuserfavorite/api/interface';
import { IViewModel } from '/@/types/common';

const ci = getCurrentInstance() as any;
const loading = ref(false);
// 定义变量内容
const formRef = ref();
const stateData = reactive<IViewModel<ISysUserFavoriteVm>>({
    vmModel: {
	  Entity:{
			ID: null,
			UserId: null,
			MenuId: null,
			MenuName: null,
			MenuIcon: null,
			MenuUrl: null,
			SortOrder: null,

      },
      
	},
     
    AllFrameworkUsers: [] as any[],
});

// 取消
const onClose = () => {
    closeDialog();
};


const onSubmit = () => {
	if (!stateData.vmModel.Entity.WorkflowStatus || stateData.vmModel.Entity.WorkflowStatus === '待提交') {
		stateData.vmModel.Entity.WorkflowStatus = '提交中';
	}
    onSave();
};



// 提交
const onSave = () => {
    formRef.value?.validate((valid: boolean) => {
		if (valid) {
		      loading.value = true;
           api().edit(stateData.vmModel).then(() => {
                ElMessage.success(ci.proxy.$t('message._system.common.vm.submittip'));
                emit('refresh');
                closeDialog();
            }).catch((error) => {
                other.setFormError(ci, error);
            }).finally(() => {
                loading.value = false;
            });
		}
	})
};

// 页面加载时
onMounted(() => {
	loading.value = true;
  if (ci.attrs["wtmdata"]) {
		stateData.vmModel.Entity.ID = ci.attrs["wtmdata"].ID;
	}
	else if (useRouter().currentRoute.value.query.id) {
		stateData.vmModel.Entity.ID = useRouter().currentRoute.value.query.id as any;
	}
	const promises : Promise<any>[] = [
    
    other.getSelectList('/api/SysUserFavorite/GetFrameworkUsers',[],false).then(x=>{stateData.AllFrameworkUsers = x}),

    api()
      .get(stateData.vmModel.Entity.ID ?? "")
      .then((data: any) => other.setValue(stateData.vmModel, data))
	];
	Promise.allSettled(promises).finally(() => {
		loading.value = false;
    // 设置对话框头部按钮
    nextTick(() => {
      setupHeaderButtons();
    });
	});
});

// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh', 'closeDialog', 'updateHeaderButtons']);

// 关闭弹窗
const closeDialog = () => {
    emit('closeDialog');
};
// 设置对话框头部按钮
const setupHeaderButtons = () => {
	const headerButtons = [
		{
			text: '保存',
			type: undefined, // 默认样式，简约灰色
			onClick: onSave,
      visible: true, // 默认显示
		},

	{
		text: '提交',
		type: 'primary', // 主要操作，醒目蓝色
        onClick: stateData.vmModel.Entity.WorkflowStatus === '审核中' ? onAgree : onSubmit,
		visible: true, // 编辑页面默认显示提交按钮
	},


	];
	// 通知父对话框更新头部按钮
	emit('updateHeaderButtons', headerButtons);
};
</script>
